<template>
	<div class="invoice">
		<!-- 添加 -->
		<!-- <el-card class="box-card" shadow="hover">
      <el-row>
        <el-button type="primary" class="add-invoice" @click="addAgent">添加</el-button>
        <el-button type="info" class="add-invoice" @click="exportAll">导出</el-button>
      </el-row>
    </el-card>-->
		<orderStatistics :myInfo ='myInfo' :roleID='roleID'  @getData='changeData'/>

		<el-button v-if="$store.state.user.role_id != 1" type="primary" class="openInvoices" @click="editInvoices()" v-no-more-click:3000>开票</el-button>
		<el-popover placement="left" trigger="click">

			<template>
				<el-checkbox v-model="checked" @change="selectArr">全选</el-checkbox>
				<br />
				<el-checkbox v-model="checked1">订单编号</el-checkbox>
				<br />
				<el-checkbox v-model="checked2">申请人</el-checkbox>
				<br />
				<el-checkbox v-model="checked9">流程人员</el-checkbox>
				<br />
				<el-checkbox v-model="checked10">邮寄地址</el-checkbox>
				<br />
				<el-checkbox v-model="checked3">手机号码</el-checkbox>
				<br />
				<el-checkbox v-model="checked4">邮箱</el-checkbox>
				<br />
				<el-checkbox v-model="checked5">发票抬头</el-checkbox>
				<br />
				<el-checkbox v-model="checked6">发票税号</el-checkbox>
				<br />
				<el-checkbox v-model="checked7">付款渠道</el-checkbox>
				<br />
				<el-checkbox v-model="checked8">申请时间</el-checkbox>
			</template>
			<el-button style="float: right;margin-bottom: 5px;margin-top: 0;" slot="reference" icon="el-icon-arrow-down">显示字段</el-button>
		</el-popover>

			<!-- 列表查找 -->
		<span class="down-execel">
			<!-- <Icon type="ios-funnel-outline" /><a href="javascript:;">筛选条件</a> -->
			<Poptip v-model="showFilter" placement="bottom-end" @on-popper-show ='getAllAgent'>
			<!-- <Icon type="ios-funnel-outline" /> -->
				<i class="el-icon-search poptip-condition-add"></i>
				<a href="javascript:;">列表查找</a>
				<!-- <div slot="title"><i></i></div> -->
				<div slot="content">
					<Poptip v-model="showFilterCondition" placement="bottom-start" class='poptip-condition'>
						<i class="el-icon-plus poptip-condition-add"></i>
						<a href="javascript:;" class='poptip-condition-add'>添加过滤条件</a>
						<div slot="content" class="condition-list">
							<ul>
								<li v-for="(item, index) in columns" :key="index" class='poptip-condition-item' @click="addFilterCondition(item)">{{item.label}}</li>
							</ul>
						</div>
					</Poptip>
					<el-form :model="conditionForm"  @submit.native.prevent ref="conditionForm" label-min-width="120px" class="demo-dynamic">
						<el-form-item v-for="(condition, index) in conditionForm.condition" :label="condition.label" :key="condition.key"
							:prop="'condition.' + index + '.value'" :rules="{
										required: true, message: condition.label +'不能为空', trigger: 'blur'
									}"
								>
								<el-date-picker
									v-model="apply_at"
									type="daterange"
									placeholder="选择日期"
									value-format="yyyy-MM-dd"
									size="small"
									:validate-event='false'
									@input = 'changInput'
									v-if='condition.label === "申请时间"'>
								</el-date-picker>

								<el-select
									size="small"
									filterable
									v-model="condition.value"
									v-else-if='condition.label === "流程人员"'>
									<el-option
										v-for="item in processOptions"
										:key="item.id"
										:label="item.name"
										:value="item.id">
									</el-option>
								</el-select>

								<el-select v-else-if='condition.label === "付款渠道"' v-model="condition.value" placeholder="请选择付款渠道" size="small">
									<el-option label="银行转账" value="银行转账"></el-option>
									<el-option label="微信" value="微信"></el-option>
									<el-option label="支付宝" value="支付宝"></el-option>
								</el-select>

								<el-input v-else size="small" v-model="condition.value" @keyup.enter.native="submitsearch('conditionForm')"></el-input>
								<el-button @click.stop="removeDomain(condition)" size="mini">删除</el-button>
							</el-form-item>

						</el-form>
						<div class= 'btns'>
							<el-button @click="submitsearch('conditionForm')" size="mini">查询</el-button>
							<el-button  @click.stop="resetForm1('conditionForm')" size="mini">重置</el-button>
						</div>

				</div>
			</Poptip>
		</span>

		<el-table
			id="IMTable"
			:data="tableData"
			border
			v-loading="loading"
			ref="multipleTable"
			tooltip-effect="dark"
			height="88%"
			@sort-change='tableSortChange'
			@selection-change="handleSelectionChange">
			<el-table-column show-overflow-tooltip type="selection" min-width="55" :selectable='checkboxT'></el-table-column>
			<el-table-column show-overflow-tooltip label="ID" min-width="60" align="left" v-if='checked99'><template slot-scope="scope">{{scope.$index + 1}}</template></el-table-column>
			<el-table-column show-overflow-tooltip v-if="checked1" prop="order_number" label="订单编号" min-width="200" sortable='custom' align="left">
				<template slot-scope='scope'>
					<span>
						{{ scope.row.final ? scope.row.final.order_number : scope.row.order_number }}
					</span>
				</template>
			</el-table-column>
			<el-table-column show-overflow-tooltip v-if="checked2" prop="liaisons" label="申请人" min-width="100" align="left" sortable='custom'>
				<template slot-scope="scope">
					<template v-if="scope.row.final">
						{{ scope.row.final.order ?  scope.row.final.order.liaisons : '' }}
					</template>
				</template>
			</el-table-column>
			<el-table-column show-overflow-tooltip v-if="checked3" prop="liaisons_tel" label="手机号码" min-width="130" align="left" sortable='custom'>
				<template slot-scope="scope">
					<template v-if="scope.row.final">
						{{ scope.row.final.order ?  scope.row.final.order.liaisons_tel : '' }}
					</template>
				</template>
			</el-table-column>
			<el-table-column show-overflow-tooltip v-if="checked4" prop="liaisons_email" label="邮箱" min-width="150" align="left" sortable='custom'>
				<template slot-scope="scope">
					<template v-if="scope.row.final">
						{{ scope.row.final.order ?  scope.row.final.order.liaisons_email : '' }}
					</template>
				</template>
			</el-table-column>
			<el-table-column show-overflow-tooltip v-if="checked11" prop="money" label="开票金额(元)" min-width="140" align="left" sortable='custom'></el-table-column>
			<el-table-column show-overflow-tooltip v-if="checked5" prop="taitou" label="发票抬头" min-width="160" align="left" sortable='custom'>
				<template slot-scope='scope'>
					{{ scope.row.invoice.taitou }}
				</template>
			</el-table-column>
			<el-table-column show-overflow-tooltip v-if="checked6" prop="tariff_number" label="发票税号" min-width="160" align="left"  sortable='custom'>
				<template slot-scope='scope'>
					{{ scope.row.invoice.tariff_number }}
				</template>
			</el-table-column>
			<el-table-column show-overflow-tooltip v-if="checked10" prop="send_addr" label="邮寄地址" min-width="180" align="left"  sortable='custom'></el-table-column>
			<el-table-column show-overflow-tooltip v-if="checked7" prop="channel" label="付款渠道" align="left" min-width="120" sortable='custom'></el-table-column>
			<el-table-column show-overflow-tooltip v-if="checked9" prop="process" label="流程人员" min-width="120" align="left" sortable='custom'>
				<template slot-scope="scope">
					<template v-if="scope.row.final">
						<span v-if="scope.row.final.order">
							{{ scope.row.final.order.process ?  scope.row.final.order.process.name : '' }}
						</span>
					</template>
				</template>
			</el-table-column>
			<el-table-column show-overflow-tooltip v-if="checked8" prop="created_at" label="申请时间" min-width="180" align="left" sortable='custom'></el-table-column>
			<el-table-column  v-if="$store.state.user.role_id != 4 && checked99" width="80" fixed="right" align="center" label="操作">
				<template slot-scope="scope">
					<el-button v-if="$store.state.user.role_id != 4" type="danger" size="small" @click="delInvoice(scope.row,scope.$index)" v-no-more-click:3000>删除</el-button>
				</template>
			</el-table-column>
		</el-table>

		<!-- 提交开票信息 -->
		<el-dialog title="提交开票信息" :visible.sync="dialogFormVisible" center :before-close="handleClose">
			<el-form :model="form" :rules="rules" ref="ruleForm">
				<el-form-item
					label="发票编号"
					v-for="(item,index) in form.invoice_number_arr"
					:key='index'
					:prop="'invoice_number_arr.' + index"
					:rules="[
						{ required: true, message: '请输入发票编号'},
						{ type: 'number', message: '发票编号必须为数字值'}
					]">
					<el-input class="invInput" v-model.number="form.invoice_number_arr[index]" autocomplete="off" :maxlength="8">
						<el-button slot="append" @click.prevent="removeInput(form.invoice_number_arr[index])" icon="el-icon-delete" v-no-more-click:3000></el-button>
					</el-input>
					<!-- <el-button class="invBut" >删除</el-button> -->
				</el-form-item>
				<el-button type="primary" icon="el-icon-plus" @click="form.invoice_number_arr.push('')" v-no-more-click:3000>添加发票编号</el-button>
				<Divider></Divider>
				<!-- <el-form-item label="发票数量" prop="number">
					<el-input v-model="form.number" autocomplete="off"></el-input>
				</el-form-item> -->
				<el-form-item label="开票日期" prop="ticket_at">
					<el-date-picker v-model="form.ticket_at" type="date" placeholder="开票日期" value-format="yyyy-MM-dd" :picker-options="pickerOptions0">
					</el-date-picker>
				</el-form-item>
				<el-form-item label="开票金额" prop="money">
					<el-input v-model.number="form.money" autocomplete="off"></el-input>
				</el-form-item>
				<el-upload class="upload-demo" ref="upload" :action="uploadFileUrl" :on-preview="handlePreview" :on-remove="handleRemove"
				 :limit="5" :on-success="handleSuccess" :file-list="fileList" :auto-upload="true" :before-upload="beforeUpload"
				 :http-request="uploadFile" multiple>
					<el-button slot="trigger" type="primary" v-no-more-click:3000>上传发票文件</el-button>
					<div slot="tip" class="el-upload__tip">只能上传pdf文件，且不超过100M</div>
				</el-upload>
			</el-form>
			<div slot="footer" class="dialog-footer">
				<el-button @click="handleClose" v-no-more-click:3000>取 消</el-button>
				<el-button type="primary" @click="submitForm('ruleForm')" v-no-more-click:3000>确 定</el-button>
			</div>
		</el-dialog>

		<!-- 分页 -->
		<el-pagination class="pagination" @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage"
		 :page-sizes="pageSizes" :page-size="Number(pageSize)" layout="total, sizes, prev, pager, next, jumper" :total="total"></el-pagination>
	</div>
</template>
<script>
	import axios from 'axios'
	import {
		getInvoiceList,
		savInvoiceNumber,
		delInvoice
	} from "~/api/invoice";
	import { getMyInfo } from "~/api/user"
	import orderStatistics from "~/components/orderStatistics"
	export default {
		head: {
			title: "未开票列表"
		},
		name: "invoice",
		components : {
			orderStatistics
		},
		data() {
			let that = this; //全局声明，在整个data函数里可用

			let moneyValidator = (rule, value, callback) => {
				if (!value) {
          return callback(new Error('金额不能为空'));
        }
				if (!Number.isInteger(value)) {
					callback(new Error('金额只能是数字'));
				} else {
					callback();
				}
			}
			return {
				checked99: true,
				roleID: '',
				myInfo: {},
				checked: true,
				checked1: true,
				checked2: true,
				checked3: true,
				checked4: true,
				checked5: true,
				checked6: true,
				checked7: true,
				checked8: true,
				checked9: true,
				checked10: true,
				checked11: true,
				loading: false,
				tableData: [],
				form: {
					invoice_number_arr: [''],
					number: '',
					ticket_at: '',
					money: '',
				},
				dialogFormVisible: false,
				rules: {
					number: [{
						required: true,
						message: "请输入发票数量",
						trigger: "blur"
					}],
					ticket_at: [{
						required: true,
						message: "请输入开票日期",
						trigger: "blur"
					}],
					money: [{
						validator: moneyValidator, trigger: "blur"
					}]
				},
				tableSize: 10, //一页几条
				tableStart: 0, //table数组过滤的第一条索引
				tableEnd: 10, //table数组过滤的最后一条索引
				currentPage: 1, //目前在第几页
				pageSizes: [25, 50], //一页可以几条
				pageSize: 25, //一页可以几条
				total: 0,
				uploadFileUrl: global.baseurl + '/api/upload/file',
				fileList: [],
				fileListV: [],
				showFilter: false, // 控制显示筛选条件
				showFilterCondition: false,
				conditionForm: {
					condition: []
				}, //筛选条件
				columns: [
					{
						label: '订单编号',
						id: 1,
						parameter: 'order_number'
					},
					{
						label: '申请人',
						id: 2,
						parameter: 'liaisons'
					},
					{
						label: '手机号码',
						id: 3,
						parameter: 'liaisons_tel'
					},
					{
						label: '邮箱',
						id: 4,
						parameter: 'liaisons_email'
					},
					{
						label: '发票抬头',
						id: 5,
						parameter: 'taitou'
					},
					{
						label: '发票税号',
						id: 6,
						parameter: 'tariff_number'
					},
					{
						label: '邮寄地址',
						id: 7,
						parameter: 'send_addr'
					},
					{
						label: '付款渠道',
						id: 8,
						parameter: 'channel'
					},
					{
						label: '流程人员',
						id: 9,
						parameter: 'process_id'
					},
					{
						label: '申请时间',
						id: 10,
						parameter: 'apply_at'
					},
				],
				lastTime: 0,
				searchValue: '',
				updated_at: [],
				apply_at: [],
				processOptions: [],
				restaurants2: [],
				pickerOptions0: {
					disabledDate(time) {
						return time.getTime() > Date.now();
					}
				},
				paramsByInv: {
					status: "等待开票",
				},
				selectionInvArr: []
			};
		},
		async asyncData({
			$axios
		}) {
			let res = await getInvoiceList($axios, {
				status: "等待开票"
			});
			let obj = {
				loading: false
			};
			if (res.data.code == 200) {
				obj.total = res.data.page.total;
				obj.tableData = res.data.data;
				obj.pageSize = res.data.page.per_page;
				obj.tableSize = res.data.page.per_page;
				obj.tableEnd = res.data.page.per_page;

			}
			return obj;
		},
		created () {
			this.$axios.get('/api/consumer/show').then( res => {
				if (res.data.code == 200) {
					this.myInfo = res.data.data
					this.roleID = this.myInfo.role_id
				}
			})
		},
		computed: {
			checkedArr() {
				let arr = [this.checked1, this.checked2, this.checked3, this.checked4, this.checked5, this.checked6, this.checked7, this.checked8, this.checked9, this.checked10, this.checked11]
				return arr
			}
		},
		methods: {
			selectArr(val) {
				if (val) {
						this.checked1 = true;
						this.checked2 = true;
						this.checked3 = true;
						this.checked4 = true;
						this.checked5 = true;
						this.checked6 = true;
						this.checked7 = true;
						this.checked8 = true;
						this.checked9 = true;
						this.checked10 = true;
						this.checked11 = true;

					} else {
						this.checked1 = false;
						this.checked2 = false;
						this.checked3 = false;
						this.checked4 = false;
						this.checked5 = false;
						this.checked6 = false;
						this.checked7 = false;
						this.checked8 = false;
						this.checked9 = false;
						this.checked10 = false;
						this.checked11 = false;
					}
				},
			removeInput (item) {
				var index = this.form.invoice_number_arr.indexOf(item)
        if (index !== -1) {
          this.form.invoice_number_arr.splice(index, 1)
        }
			},
			async getMyinfo (params) {
				let myInfo = await getMyInfo(this.$axios, params);
				if (myInfo.data.status == 'success') {
					this.$store.commit("setRoleInfo",myInfo.data.data)
					this.$store.commit("setUser",myInfo.data.data)
					this.myInfo = myInfo.data.data
				}
			},
			//编辑
			editInvoices() {
				// console.log(val)
				if (this.selectionInvArr.length == 0) {
					this.$message({
						message: '请至少选择一个订单！',
						type: 'warning'
					})
					return
				}
				let orderId = []
				let sumMoney = null
				for(let i = 0; i < this.selectionInvArr.length; i++) {
					//  this.form.invoiceRecord = this.selectionInvArr[i].id
					orderId.push(this.selectionInvArr[i].id)
					sumMoney += Number(this.selectionInvArr[i].money)
				}
				this.form.money = sumMoney
				this.form.invoiceRecord = orderId.join(',')
				this.dialogFormVisible = true
			},
			uploadFile(params) {
				this.fileListV.push(params.file)
			},
			//提交数据
			submitForm(formName) {
				let that = this;
				this.$refs[formName].validate(valid => {
					if (valid) {
						if (that.fileListV.length <= 0) {
							this.$message({
								type: "warning",
								message: "请至少上传一个发票文件"
							});
						} else {
							//主要逻辑
							var form = new FormData()

							form.append("invoiceRecord", that.form.invoiceRecord);
							form.append("invoice_number", that.form.invoice_number_arr.join(','));
							//form.append("number", that.form.number);
							form.append("ticket_at", that.form.ticket_at);
							form.append("money", that.form.money);
							for (let i in that.fileListV) {
								form.append(i == 0 ? "file" : ("file" + (i * 1 + 1)), that.fileListV[i]);
							}
							axios({
								method: "post",
								url: global.baseurl + '/api/invoice/update',
								data: form,
								headers: {
									"Content-Type": "multipart/form-data",
									Authorization: "Bearer " + this.$store.state.token
								}
							}).then(res => {
								if (res.data.status == "success") {
									this.$message({
										type: "success",
										message: "提交成功"
									});
									this.$refs[formName].resetFields();
									this.fileList = []
									this.dialogFormVisible = false;
									this.search();
								} else {
									this.$message({
										type: "error",
										message: res.data.message
									});
								}
							});
						}
					} else {
						return false;
					}
				})
			},
			resetForm(formName) {
				this.$refs[formName].resetFields();
			},

			handleClose() {
				this.dialogFormVisible = false;
				this.resetForm("ruleForm")
			},

			// 删除
			delInvoice(val, index) {
				this.$confirm("是否删除未开票信息?", "提示", {
						confirmButtonText: "确定",
						cancelButtonText: "取消",
						center: true,
						type: "warning"
					})
					.then(() => {
						delInvoice(this.$axios, val.id)
							.then(res => {
								if (res.data.code == 200) {
									this.$message({
										message: "删除成功",
										type: "success"
									});
									//删除这条数据
									this.tableData.splice(index, 1);
								} else {
									this.$message({
										message: res.data.message,
										type: "error"
									});
								}
							})
							.catch(err => {
								this.$message({
									message: err,
									type: "error"
								});
							});
					})
					.catch(err => {
						this.$message({
							type: "info",
							message: err
						});
					});
			},

			//刷新数据
			onChangeList() {
				this.changeData()
			},
			//获取新数据
			changeData(params) {
				if (params) {
					this.paramsByInv.process_id = params.process_id
				}
				let that = this;
				getInvoiceList(that.$axios, this.paramsByInv)
					.then(res => {
						this.tableData.splice(0, this.tableData.length, ...res.data.data);
						this.pageSize = res.data.page.per_page;
						this.tableSize = res.data.page.per_page;
						this.tableEnd = res.data.page.per_page;
						this.getMyinfo()
					})
					.catch(err => {
						console.log(err);
					});
			},
			// 多选
			handleSelectionChange(val) {
				this.selectionInvArr = val
			},
			//选择一页几条
			handleSizeChange(size) {
				this.paramsByInv.perPage = size
				this.paramsByInv.page = 1
				getInvoiceList(this.$axios, this.paramsByInv)
				.then(res => {
					if (res.data.code == 200) {
						this.tableData.splice(0, this.tableData.length, ...res.data.data)
						this.pageSize = res.data.page.per_page
						this.tableSize = res.data.page.per_page
						this.tableEnd = res.data.page.per_page
					}
				})
			},
			//选择第几页
			handleCurrentChange(currentPage) {
				let params = this.paramsByInv
				params.page = currentPage
				getInvoiceList(this.$axios, params)
				.then(res => {
					if (res.data.code == 200) {
						this.tableData.splice(0, this.tableData.length, ...res.data.data)
						this.pageSize = res.data.page.per_page
						this.tableSize = res.data.page.per_page
						this.tableEnd = res.data.page.per_page
					}
				})
			},
			// //批量导出
			// exportAll() {}
			handlePreview(file) {

			},
			handleRemove(file, fileList) {
				let that = this;
				//从服务器也删除此文件
				that.$axios.delete('/api/delete/file', {
					data: {
						path: that.fileListV[fileList.length]
					}
				})
				that.fileListV.splice(fileList.length, 1);
			},
			handleSuccess(res, file, fileList) {
				///this.fileListV.push(res.data);
			},
			beforeUpload(file) {
				let that = this;
				let canUpload = true; //是否能够上传（布尔值）
				let type = file.name.substring(file.name.lastIndexOf('.') + 1);
				//不区分大小写
				if (!/pdf/i.test(type)) {
					that.$message({
						message: "文件格式只能是pdf",
						type: 'warning'
					});
					canUpload = false;
				}
				let size = file.size / 1024 / 1024;
				if (size > 10) {
					that.$message({
						message: "文件大小不能超过10M",
						type: 'warning'
					});
					canUpload = false;
				}
				return canUpload;
			},
			submitUpload() {
				this.$refs.upload.submit();
			},
			getAllAgent() {
				this.$axios.get('api/user/process')
					.then(res => {
						if (res.data.code == 200) {
							// let arr = res.data.data;
							// for (let key in arr) {
							// 	//element的模糊匹配组件el-autocomplete指定：必须数组的每个元素是个对象，并且有value属性
							// 	arr[key].value = arr[key].name;
							// }
							// this.restaurants2 = arr;
							this.processOptions = res.data.data
						}
					})
					.catch(err => {
						this.$message({
							type: "err",
							message: err
						});
					});

			},

			// 添加条件筛选
			addFilterCondition(item) {
				let filterItem = {
					value: '',
					label: item.label,
					parameter: item.parameter,
					key: Date.now()
				}
				if (this.conditionForm.condition.length > 0) {
					let conditionlabels = []
					for (let i = 0; i < this.conditionForm.condition.length; i++) {
						conditionlabels.push(this.conditionForm.condition[i].label)
					}
					let Check = conditionlabels.indexOf(item.label)
					Check == -1 ? this.conditionForm.condition.push(filterItem) : this.$message.error('请勿重复添加')
				} else {
					this.conditionForm.condition.push(filterItem)
				}

				this.showFilterCondition = false;

			},

			resetForm1(formName) {
				this.showFilter = true
				this.$refs[formName].resetFields()
				this.$refs['multipleTable'].clearSort()
				this.conditionForm.condition.forEach(v => {
					if (v.value) {
						v.value = null
					}
				});
				this.showFilterCondition = false
				this.apply_at = []
				this.paramsByInv = {
					status: '等待开票'
				}
				this.$nextTick(() => {
					this.$refs[formName].clearValidate()
				})
        // this.changeData()
        // this.showFilter = false

			},
			removeDomain(item) {
				this.showFilter = true
				delete this.paramsByInv[item.parameter]
				let index = this.conditionForm.condition.indexOf(item)
				if (index !== -1) {
					this.conditionForm.condition.splice(index, 1)
				}
				if (item.label === '申请时间') {
					this.apply_at = []
					delete this.paramsByInv.start_time
					delete this.paramsByInv.end_time
				}

				this.search()
			},
			changInput () {
      	this.$refs['conditionForm'].clearValidate();
    	},
			search() {
				this.currentPage = 1
				for (var i = 0; i < this.conditionForm.condition.length; i++) {
					let a = this.conditionForm.condition[i].parameter
					if (this.conditionForm.condition[i].parameter === 'apply_at') {
						this.paramsByInv.start_time = this.apply_at[0]
						this.paramsByInv.end_time = this.apply_at[1]
					}
					this.paramsByInv[a] = this.conditionForm.condition[i].value
				}

				// 处理分页数据
				delete this.paramsByInv.page

				// 处理排序状态
				delete this.paramsByInv.sort_str
				delete this.paramsByInv.sort_order
				this.$refs['multipleTable'].clearSort()

				getInvoiceList(this.$axios, this.paramsByInv)
					.then(res => {
						this.tableData.splice(0, this.tableData.length, ...res.data.data);
						this.pageSize = res.data.page.per_page;
						this.tableSize = res.data.page.per_page;
						this.tableEnd = res.data.page.per_page;
            this.total = res.data.page.total;
						this.getMyinfo()
					})
					.catch(err => {
						this.$message.error('服务器繁忙！请稍后再试')
					});
				// this.tableData = data.tableData

			},
			submitsearch(formName) {
				let that = this
				this.$refs[formName].validate((valid, prop) => {
					// this.$refs[formName].clearValidate();
					let props = []
					for (let k in prop) {
						props.push(prop[k][0].field)
						if (prop[k][0].message = '申请时间不能为空') {
							if (that.apply_at) {
								if (that.apply_at.length > 0) {
									that.$refs[formName].clearValidate([prop[k][0].field])
									// that.search()
									let timeIndex = props.indexOf('申请时间不能为空')
									props.splice(timeIndex, 1)
								}
							}	else return false

						}
					}

					if (props.length) {
						that.$refs[formName].validateField(props, (valid2) => {
							if (valid2) {
								return false;
							} else {
								that.search()
								this.showFilter = false
							}

						})
					} else {
						this.showFilter = false
						that.search()
					}
				})
			},
			// 表格排序
			tableSortChange(column) {
				if (column.order === 'descending') {
					this.paramsByInv.sort_str = column.prop
					this.paramsByInv.sort_order = 'desc'
				} else if (column.order === 'ascending') {
					this.paramsByInv.sort_str = column.prop
					this.paramsByInv.sort_order = 'asc'
				} else {
					delete this.paramsByInv.sort_str
					delete this.paramsByInv.sort_order
				}

				this.loading = true;
				this.$axios.get('/api/invoice', {
					params: this.paramsByInv
				})
				.then(res => {
					this.loading = false;
					this.tableData = res.data.data;
					this.pageSize = res.data.page.per_page;
					this.tableSize = res.data.page.per_page;
					this.tableEnd = res.data.page.per_page;
					this.total = res.data.page.total;
				})
			},
			// 流程只能开自己的订单
			checkboxT(row, rowIndex) {
				if (this.$store.state.user.role_id == 4) {
					if (row.process_id != this.$store.state.user.id) {
						return false
					} else {
						return true
					}
				} else if (this.$store.state.user.role_id == 7) {
					return true
				}
			}
		},
		beforeUpdate() {
			this.$nextTick(() => {
				this.$refs.multipleTable.doLayout();
			});
		},
		watch: {
			// watch: {
			dialogFormVisible(val) {
				if (!val) {
					this.$refs['ruleForm'].resetFields();
					// for(let i = 0; i < this.checkTable.length; i++) {
					// 	this.checkTable[i] = false
					// }
					this.$refs['multipleTable'].clearSelection()
				}
			},
			// },
			checkedArr: {
				handler: function(val) {
					if (val.some(v => v == false)) {
						this.checked = false
					} else {
						this.checked = true
					}
					if (val.every(v => v == false)) {
						this.checked99 = false
					} else {
						this.checked99 = true
					}
				},
				deep: true
			}
		},
	};
</script>
<style lang="less" scoped>
	.invoice {
		height: 100%; //撑满表格
    .el-table {
      width: 99.9% !important;
    }
	}
	.el-card {
		margin-bottom: 10px;
	}
	.el-main .ivu-poptip .ivu-poptip-popper .ivu-poptip-content .ivu-poptip-inner{
		min-width: 480px ;
		// height: 300px;
		overflow-y:scroll;

	}

	.poptip-condition {
		display: block;
		margin-top: 10px;

		.poptip-condition-item {
			line-height: 25px;
			cursor: pointer;
		}

		.poptip-condition-add {
			font-size: 14px;
		}
	}

	.demo-dynamic {
		padding-left: 10px;

		.el-form-item {
			margin-bottom: 12px;
		}

		.el-input {
			width: 240px;
		}

		.el-date-editor {
			width: 240px;
		}

		.el-button {
			padding: 9px 15px;
			vertical-align: baseline;
		}

		.el-form-item__error {
			padding-top: 0;
		}

	}
	.btns {
		margin-top: 10px;
	}

	.el-main .poptip-condition .ivu-poptip-popper .ivu-poptip-content .ivu-poptip-inner {
		min-width: 180px;
	}
	.tableLastCol{
		padding-right: 14px;
	}
	.down-execel {
		display: block;
		height: 40px;
		line-height: 40px;
		color: #333333;
		font-size: 14px;
		margin-right: 20px;
		float: right;
	}
	.openInvoices {
		padding: 9px 20px;
		vertical-align: middle;
	}
	.invBut {
		float: right;
	}
</style>
